<template>
    <div class="container">
        <div class="sider">
            <ul>
                <li>
                    <router-link to="/users">用户管理</router-link>
                </li>
                <li>
                    <router-link to="/product">商品管理</router-link>
                </li>
            </ul>
        </div>
        <div class="content">
            <!-- 二级路由出口 -->
            <router-view></router-view>
        </div>
    </div>
</template>

<script lang='ts' setup>
</script>

<style lang='scss' scoped>
    .container{
        display: flex;
        height: 100vh;
        .sider{
            width: 200px;
            height: 100%;
            background-color: #f5f5f5;
        }
        .content{
            flex-grow: 1;
            height: 100%;
            background-color: yellow;
        }
    }
</style>